@charset "utf-8";
/* CSS Document */

body{background-color:#051629;}
@-webkit-keyframes move
{
	0%{
		background-position:300px 0;
	}
	100%
	{
		background-position:1400px 0;
	}	
}
.wrap{width:310px;height:310px;padding:100px; border:5px solid rgba(3,20,39,0.2); margin:25px auto; perspective:200px;  perspective-origin:center center;border-radius:50%;}
.box{width:100px;height:100px; position:relative; transform-style:preserve-3d; transition:2s;transform-origin:center center -50px; transition:1.5s; }
.box div{width:100px;height:100px; position:absolute; color:#fff;font-size:20px; text-align:center;line-height:100px;}
.box div:nth-of-type(1){left:0;top:-100px;background:radial-gradient(rgba(36,90,150,1),rgba(36,90,150,0)); transform-origin:bottom; transform:rotateX(90deg);}
.box div:nth-of-type(2){left:-100px;top:0px;background:radial-gradient(rgba(36,90,150,1),rgba(36,90,150,0));  transform-origin:right; transform:rotateY(-90deg);}
.box div:nth-of-type(3){left:0px;top:0px;background:radial-gradient(rgba(36,90,150,1),rgba(36,90,150,0));}
.box div:nth-of-type(4){left:100px;top:0;background:radial-gradient(rgba(36,90,150,1),rgba(36,90,150,0));transform-origin:left;transform:rotateY(90deg);}
.box div:nth-of-type(5){left:0px;top:100px;background:radial-gradient(rgba(36,90,150,1),rgba(36,90,150,0));transform-origin:top;transform:rotateX(-90deg);}
.box div:nth-of-type(6){left:0;top:0;background:radial-gradient(rgba(36,90,150,1),rgba(36,90,150,0));transform:translateZ(-100px) rotateX(180deg);}
.box1{ transform:rotateX(270deg);}
.box button{ display:block; border:none; background:radial-gradient(rgba(36,90,150,1),rgba(36,90,150,0)); width:100px; height:100px;}
.box button i{color:#fff; display:block; text-align:center; font-size:50px;}
.box button span{font:16px/20px "微软雅黑"; color:#fff; display:block; text-align:center;}
h1{font:80px/180px "微软雅黑";color:rgba(255,255,255,0.5); background:-webkit-linear-gradient(-30deg,rgba(255,255,255,0) 100px,rgba(255,255,255,1) 180px,rgba(255,255,255,1) 240px,rgba(255,255,255,0) 300px) -300px 0 no-repeat; -webkit-background-clip:text; height:200px; text-align:center;animation:5s move infinite linear; text-shadow:2px 2px 1px rgba(255,255,255,0.3),3px 3px 1px rgba(255,255,255,0.2),4px 4px 1px rgba(255,255,255,0.1);}
h1::selection{background-color:rgba(255,255,255,0.1);}
h1::-moz-selection{background-color:rgba(255,255,255,0.1);}
.index_bg{position:absolute; z-index:-1; left:50%; top:0; margin-left:-960px;}
.succeed{text-align:center; font-size:60px; color:rgba(255,255,255,0.8); line-height:80px; height:80px;}

